<style type="text/css">
	#AddDev{
		position:fixed;
		top:0px;
		line-height:1.111rem;
		text-align:right;
		font-size:0.4rem;
		color:#575757;
		right:0.5rem;
	}
	ul.list{
		margin:0 0.5rem;
	}
	a.list-item{
		text-decoration:none;
	}
	li.list-item{
		font-size:0;
		height:1.25rem;
		line-height:1.25rem;
		overflow:hidden;
		border-bottom:1px solid #E9E9E9;
	}
	a.list-item:last-child li.list-item{
		border-bottom:0;
	}
	div.left-con{
		float:left;
		width:40%;
		color: #949494;
	}
	i.verdor-icon{
		font-size:1.25rem;
		display:inline-block;
	}
	div.right-con{
		float:right;
		width:40%;
	}
	span.list-con1{
		color:#575757;
		font-size:0.417rem;
	}
	i.dev-other{
		float:right;
		line-height:1.25rem;
		font-size:0.5rem;
		color:#A8A8A8;
		-webkit-transform: rotate(180deg);
	}
	span.time-size{
		font-size:0.4rem;
		width:1rem;
		display:inline-block;
		text-align:center;
		color:#949494;
	}
</style>
<script type="text/javascript">
(function(){
	<%
		local para = {
			parent_ctrl = {config = {}, parent_list = {}},
			device_manage = {client_list = {}}
		}

		local result = tpl_get_data(para, true)
	-%>

	var parentInfo = <%=result%>;

	var param = stateman.current.param;
	var client = {};
	for (var k in param){
		var key = decodeURIComponent(k);
		var val = decodeURIComponent(param[k]);
		client[key] = val;
	}

	$(".head-title").html(getStrInMax(client.name, 18)).attr("title", client.name);

	function getDevlist(rules){
		for(var i = 0; i < rules.length; ++i){
			if(client.mac == rules[i]["mac"]){
				var dev={};
				dev["id"] = rules[i]["id"];
				dev["name"] = rules[i]["name"];
				dev["mac"] = rules[i]["mac"];
				dev["cycle"] = rules[i]["cycle"];
				dev["start_time"] = rules[i]["start_time"];
				dev["end_time"] = rules[i]["end_time"];
				devList.push(dev);
			}
		}
	}

	function getHour(time){
		var hour = parseInt(time/3600);
		return hour;
	}

	function getMinute(time){
		var minute = parseInt(time%3600);
		minute = parseInt(minute/60);
		return minute;
	}

	function setTimeList(num){
		if(num < 10){
			num = "0"+num;
		}
		return num;
	}

	function getWeekByDay(day){
		var value="";
		for (var i=0;i<day.length;++i){
			if(day[i]=="1"){
				if (value.length >0){
					value += ",";
				}
				value += week[i];
			}
		}

		if (day == "0000011"){
			value = label.weekend;
		}else if(day == "1111100"){
			value = label.workDay;
		}else if(day == "1111111"){
			value = label.everyDay;
		}
		return value;
	}

	var devList = [];
	var parentList = parentInfo[K_MODULE].parent_ctrl.parent_list;
	var week = [label.Monday, label.Tuesday, label.Wednesday, label.Thursday, label.Friday, label.Saturday, label.Sunday];
	var day = [label.everyDay, label.workDay, label.weekend, label.custom];

	getDevlist(parentList);
	parentRule(devList);

	function JSON2UriParam(data){
		return $.param(data).replace(/\+/g, '%20');
	}

	function parentEntry(client){
		var param = JSON2UriParam(client);

		return '<a href="#/parentCtrlAddRule/?action=edit&' + param + '" class="list-item"><li class="list-item">' +
			'<div class="left-con"><span class="list-con1">' + getWeekByDay(client.cycle) + '</span></div>' +
			'<div class="right-con">' +
				'<i class="icon_back dev-other"></i>' +
				'<span class="time-size">' + setTimeList(getHour(client.start_time)) + ':' + setTimeList(getMinute(client.start_time)) + '</span>' +
				'<span class="time-size">-</span>' +
				'<span class="time-size">' + setTimeList(getHour(client.end_time)) + ':' + setTimeList(getMinute(client.end_time)) + '</span>' +
			'</div>' +
		'</li></a>';
	}

	function parentRule(clients){
		var parentListObj = $("#ParentList");
		var len = clients.length;
		for (var i = 0; i < len; i++){
			parentListObj.append(parentEntry(clients[i]));
		}
	}

	$("#AddDev").click(function(){
		window.location.href ="#/parentCtrlAddRule/?action=add&name=" + client.name + "&mac=" + client.mac;
	});
})();
</script>
<div class="head-con">
	<a href="#/parentCtrl" class="head-btn-l"><i class="head-btn icon icon_back"></i></a>
	<h1 class="head-title"></h1>
	<span id="AddDev">{%label.add%}</span>
</div>
<div class="device-list below-head">
	<ul class="set-con-title">
		<label class="title-desc-lbl">{%label.timeToBanInternetAccess%}</label>
	</ul>
	<ul id="ParentList" class="list"></ul>
</div>